<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
{{>/WEB-INF/pages/common/meta_base.part.html}}
{{>/WEB-INF/pages/common/refs_base.part.html}}
<title>变色龙 移动平台</title>
<style type="text/css">
span.error {
	background-position: 0px 3px;
}

.form-st-reg p {
	width: 30%;
}
</style>
</head>
<body>
	<div class="head">
		<div class="container head1" style="position: relative; top: 28px;">
			<div class="pull-right">
				<div class="row head-use text-right"></div>
				<div class="row menu"></div>
			</div>
		</div>
	</div>
	<!--Top//End-->
	<!--Con//Start-->
	<div class="container">
		<div class="hr-10"></div>
		<div class="hr-10"></div>
		<ul class="breadcrumb">
			<li><a href="{{ctx}}">首页</a></li>
			<li class="active">租户注册</li>
		</ul>
		<hr class="hr1" />
		<div class="hr-10"></div>
		<div class="bor-tab bg-st-white">
			<div class="bg-st-blue text-center pad-st-b5">
				<strong>租户注册信息</strong>
			</div>

			<form role="form" id="registerForm" action="" class="form-horizontal">
				<div class="hr-10"></div>
				<div class="col-xs-12">
					<div class="form-group">
						<label for="username" class="col-sm-4 control-label"><span
							class="font-red">*</span>租户名</label>
						<div class="col-md-5 col-sm-6 col-xs-12">
							<input type="text" class="form-control" id="accUsername"
								name="accUsername" placeholder="">
						</div>
					</div>
					<div class="form-group">
						<label for="username" class="col-sm-4 control-label"><span
							class="font-red">*</span>用户名</label>
						<div class="col-md-5 col-sm-6 col-xs-12">
							<input type="text" class="form-control" id="username"
								name="username" placeholder="">
						</div>
					</div>
					<div class="form-group">
						<label for="password" class="col-sm-4 control-label"><span
							class="font-red">*</span>密码</label>
						<div class="col-md-5 col-sm-6 col-xs-12">
							<input type="password" class="form-control" id="password"
								name="password" placeholder="">
						</div>
					</div>
					<div class="form-group">
						<label for="crmPassword" class="col-sm-4 control-label"><span
							class="font-red">*</span>确认密码</label>
						<div class="col-md-5 col-sm-6 col-xs-12">
							<input type="password" class="form-control" name="crmPassword"
								placeholder="">
						</div>
					</div>
					<div class="form-group">
						<label for="contact" class="col-sm-4 control-label"><span
							class="font-red">*</span>联系人</label>
						<div class="col-md-5 col-sm-6 col-xs-12">
							<input type="text" class="form-control" name="contact"
								placeholder="">
						</div>
					</div>
					<div class="form-group">
						<label for="telephone" class="col-sm-4 control-label"><span
							class="font-red">*</span>电话号码</label>
						<div class="col-md-5 col-sm-6 col-xs-12">
							<input type="text" class="form-control" name="telephone"
								placeholder="">
						</div>
					</div>
					<div class="form-group">
						<label for="phone" class="col-sm-4 control-label"><span
							class="font-red">*</span>手机号码</label>
						<div class="col-md-5 col-sm-6 col-xs-12">
							<input type="text" class="form-control" name="phone"
								placeholder="">
						</div>
					</div>
					<div class="form-group">
						<label for="email" class="col-sm-4 control-label"><span
							class="font-red">*</span>常用Email</label>
						<div class="col-md-5 col-sm-6 col-xs-12">
							<input type="text" class="form-control" name="email"
								placeholder="">
						</div>
					</div>

					<div class="form-group">
						<label for="companyName" class="col-sm-4 control-label"><span
							class="font-red">*</span>公司名称</label>
						<div class="col-md-5 col-sm-6 col-xs-12">
							<input type="text" class="form-control" name="companyName"
								placeholder="">
						</div>
					</div>
					<div class="form-group">
						<label for="address" class="col-sm-4 control-label"><span
							class="font-red">*</span>地址</label>
						<div class="col-md-5 col-sm-6 col-xs-12">
							<input type="text" class="form-control" name="address"
								placeholder="">
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-4 control-label">&nbsp;</label>
						<div class="col-md-5 col-sm-6 col-xs-12 text-center">
							<button class="btn btn-info btn-lg wi110" type="submit">&nbsp;注册&nbsp;</button>
							&nbsp;
							<button class="btn btn-success btn-lg wi110" type="reset">&nbsp;重填&nbsp;</button>
						</div>
					</div>
				</div>
				<p>&nbsp;</p>

			</form>
			<div class="hr"></div>
		</div>
	</div>
	<footer class="text-center pad-st-a10"> Forever Opensource
	Software Inc. All rights reserved. </footer>


</body>
</html>
<script type="text/javascript">
	$(document)
			.ready(
					function() {
						// 帐户名验证
						jQuery.validator.addMethod("isUsername", function(
								value, element) {
							var username = /^[_a-zA-Z0-9]\w{2,30}$/g;
							return this.optional(element)
									|| (username.test(value));
						}, "帐户名只能包含字母(开头)、数字和下划线");
						jQuery.validator.addMethod("isPassword",function
							(
								value, element){
							var password = /^(?![0-9]+$)(?![a-zA-Z]+$)[^\s]{8,}$/;

							return this.optional(element)
									|| (password.test(value));
						},"密码必须是字母、数字、符号混合使用");
						// 电话号码验证
						jQuery.validator.addMethod("isPhone", function(value,
								element) {
							var tel = /^(\d{3,4}-?)?\d{7,9}$/g;
							return this.optional(element) || (tel.test(value));
						}, "请正确填写您的电话号码");
						//昵称验证
						jQuery.validator.addMethod("nickName", function(value,
								element) {
							return this.optional(element)
									|| /^[\u0391-\uFFE5\w]+$/.test(value);
						}, "昵称由中文，英文字母、数字和下划线组成");
						//手机验证
						jQuery.validator
								.addMethod(
										"isMobile",
										function(value, element) {
											var length = value.length;
											var mobile = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;
											return this.optional(element)
													|| (length == 11 && mobile
															.test(value));
										}, "请正确填写您的手机号码");
						// 邮政编码验证
						jQuery.validator.addMethod("isZipCode", function(value,
								element) {
							var tel = /^[0-9]{6}$/;
							return this.optional(element) || (tel.test(value));
						}, "请正确填写您的邮政编码");

						//聚焦第一个输入框
						$("#username").focus();
						//为loginForm注册validate函数
						$("#registerForm").validate({
							event : "keyup",
							rules : {
								accUsername : {
									required : true,
									minlength : 3,
									maxlength : 30,
									isUsername : true
								},
								username : {
									required : true,
									minlength : 3,
									maxlength : 30,
									isUsername : true
								},
								password : {
									required : true,
									minlength : 8,
									maxlength : 60,
									isPassword:true

								},
								crmPassword : {
									required : true,
									equalTo : "#password"
								},
								contact : {
									required : true,
									minlength : 2,
									maxlength : 20,
									nickName : true
								},
								telephone : {
									required : true,
									isPhone : true
								},
								phone : {
									isMobile : true
								},
								email : {
									required : true,
									email : true
								},
								companyName : {
									required : true,
									minlength : 3,
									maxlength : 60
								},
								address : {
									required : true,
									minlength : 3,
									maxlength : 120
								}
							},
							messages : {
								accUsername : {
									required : "请输入租户名",
									minlength : "租户名长度至少为 3",
									maxlength : "租户名长度最大长度为 30"
								},
								username : {
									required : "请输入用户名",
									minlength : "用户名长度至少为 3",
									maxlength : "用户名长度最大长度为 30"
								},
								password : {
									required : "请输入密码",
									minlength : "密码长度至少输入 8",
									maxlength : "密码长度最大为 60"
								},
								crmPassword : {
									required : "请输入确认密码",
									equalTo : "确认密码不正确"
								},
								contact : {
									required : "请输入联系人",
									minlength : "联系人长度至少为 2",
									maxlength : "联系人长度最大为 20"
								},
								telephone : {
									required : "请输入电子号码"
								},
								email : {
									required : "请输入电子邮件地址",
									email : "请输入正确的邮件地址"
								},
								companyName : {
									required : "请输入公司名称",
									minlength : "公司名称长度至少为3",
									maxlength : "公司名称长度最大为 60"
								},
								address : {
									required : "请输入地址",
									minlength : "地址长度至少为3",
									maxlength : "地址长度最大为 120"
								}
							},
							success : function(label) {
								//label指向上面那个错误提示信息标签em
								label.text("") //清空错误提示消息
								.addClass("success").removeClass("error"); //加上自定义的success类
							}
						});

						$("#info").hide();

						$("#registerForm")
								.submit(
										function(evt) {
											var form = $(this);
											if (form.valid() == false) {
												evt.preventDefault();
												return false;
											}

											var data = $("#registerForm")
													.serialize();
											$
													.ajax({
														type : "POST",
														url : "{{ctx}}/system/account/save",
														data : data,
														headers : {
															Accept : "application/json; charset=utf-8"
														},
														contentType : "application/x-www-form-urlencoded; charset=utf-8",
														dataType : "text",
														success : function(text) {
															var ret = $
																	.parseJSON(text);
															if (ret.result) {
																window.location.href = "{{ctx}}/system/account/register-success?username="
																		+ $(
																				"#username")
																				.val();
															} else {
																bootbox
																		.alert(ret.message);
															}
														},
														error : function(xhr) {
															bootbox
																	.alert(xhr.responseText);
														}
													});
											evt.preventDefault();
											return false;
										});
					});
</script>